<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="common :: common('锁屏')">
</head>
<body class="hold-transition lockscreen">

	<!-- Automatic element centering -->
	<div class="lockscreen-wrapper">
		<div class="lockscreen-logo">
			<a href="/">&copy;<b>XIXIWAN</b> platform
			</a>
		</div>
		<!-- User name -->
		<div class="lockscreen-name">
			<span class="hidden-xs" th:text="${sysUser.username}"></span>
		</div>

		<!-- START LOCK SCREEN ITEM -->
		<div class="lockscreen-item">
			<!-- lockscreen image -->
			<div class="lockscreen-image">
				<img th:src="${sysUser.avatar}" alt="User Image">
			</div>
			<!-- /.lockscreen-image -->

			<!-- lockscreen credentials (contains the form) -->
			<form id="unlockScreenForm" action="/unlockScreen"
				class="lockscreen-credentials">
				<div class="form-group">
					<div class="input-group">
						<input type="password" name="password" class="form-control"
							placeholder="密码">

						<div class="input-group-btn">
							<button type="submit" class="btn">
								<i class="fa fa-unlock text-muted"></i>
							</button>
						</div>
					</div>
				</div>
			</form>
			<!-- /.lockscreen credentials -->
		</div>
	</div>

	<!-- /.lockscreen-item -->
	<div class="help-block text-center">输入密码解锁</div>
	<div class="text-center">
		<a href="/logout">或者以不同的用户登录</a>
	</div>

	<div class="lockscreen-footer text-center">
		<strong>Copyright &copy; 2018 <a href="/">XIXIWAN
				PLATFORM</a>.
		</strong> All rights reserved.
	</div>
	<!-- /.center -->

	<script type="text/javascript">
		$(function() {
			$('#unlockScreenForm').bootstrapValidator({
				message : '这个值是无效的',
				fields : {
					password : {
						validators : {
							notEmpty : {}
						}
					}
				}
			}).on('success.form.bv', function(e) {
				// Prevent form submission
				e.preventDefault();

				// Get the form instance
				var $form = $(e.target);

				// Get the BootstrapValidator instance
				var bv = $form.data('bootstrapValidator');

				// Use Ajax to submit form data
				$.post($form.attr('action'), $form.serialize(), function(result) {
					if (result.success) {
						if ('true' == '[[${refresh}]]') {
							parent.location.reload();
						} else {
							parent.layer.closeAll('iframe');
						}
					} else {
						layer.msg(result.errorMsg, {
							icon : 5
						});
					}
				}, 'json');
			});
		});
	</script>
</body>
</html>